// 组件允许单个组件打包，因此默认引入公共基础样式

@import "../../base.less";

@import "./_var.less";

@import "./_mixin.less";

.@{prefix}-dropdown {
  background-color: @dropdown-bg-color;
  position: relative;
  border-radius: @border-radius;
  padding: 0;

  &__menu {
    display: flex;
    justify-content: flex-start;

    &-column {
      font-size: @dropdown-text-font-size;
      color: @dropdown-text-color;
      text-align: left;
      overflow-y: auto;

      &:not(:first-child) {
        border-left: @dropdown-border;
      }
    }

    .@{prefix}-divider {
      margin: @dropdown-item-divider-margin;
    }
  }

  &__item {
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
    border-radius: @border-radius;
    color: @dropdown-text-color;
    padding: @dropdown-item-padding;
    margin: @dropdown-item-margin;
    transition: background-color @anim-duration-base @anim-time-fn-ease-in;

    &:first-child,
    &:last-child {
      margin: @dropdown-item-ends-margin;
    }

    &:hover {
      background-color: @dropdown-hover-bg-color;
    }

    &.@{prefix}-is-active {
      color: @dropdown-active-color;
      background-color: @dropdown-active-bg-color;
    }

    &.@{prefix}-is-disabled {
      color: @dropdown-disable-color;
      cursor: not-allowed;
    }

    &-content {
      display: flex;
      flex: 1;
      align-items: center;
      max-width: 100%;
    }

    &-text {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    &.@{prefix}-dropdown--suffix {
      .@{prefix}-dropdown__item-content {
        max-width: calc(
          100% - @dropdown-text-icon-size - @dropdown-item-icon-margin-left
        );
      }
      .@{prefix}-dropdown__item-icon {
        color: currentColor;
        font-size: @dropdown-text-icon-size;
        margin-left: @dropdown-item-icon-margin-left;
      }
    }

    --ripple-color: @bg-color-container-active;
  }
}
